<template>
    <div id="viewUserInfo">
        <!-- <img style="display: block;margin: 0 auto" :src="headImgUrl" /> -->
        <!-- 单引号不行，双引号可以 -->
        <img style="display: block;margin: 0 auto 30px" :src='form.headImgUrl'/>
        <el-form ref="form" :disabled='isdisabled' :model="form" label-width="80px">
            <el-form-item v-for="(item, index) in formList" :key='index' :label="item.label">
                <el-input v-model="form[item.prop]"></el-input>
            </el-form-item>
            <el-form-item label='介绍'>
                <el-input type='textarea' v-model="form.introduction"></el-input>
            </el-form-item>
        </el-form>
        <div class="btns">
            <el-button v-if="state == 1" type='primary' @click="approvel">审核通过</el-button>
            <el-button v-else type='success'>已审核通过</el-button>
            <el-button type='primary' @click="goback">关闭</el-button>
        </div>
    </div>
</template>
<script>
export default {
    data() {
        return {
            formList: [
                {prop: 'phone', label: '手机号'},{prop: 'nickname', label: '俗家姓名'},{prop: 'name', label: '法号'},
                {prop: 'sex', label: '性别'},{prop: 'address', label: '地址'}, {prop: 'merit', label: '功德'}
            ],
            form: {
                headImgUrl: '../../assets/logo.png'
            },
            isdisabled: true,
            state: 1,
            
        }
    },
    mounted(){
        this.getUserInfo()

    },
    methods: {
        goback() {
            this.$router.go(-1)
        },
        approvel() {
            let param = {
                id: this.$route.query.id
            }
            this.$api.apiApproveUser(param, res => {
                this.$message({
                    type: 'success',
                    message: '审核通过'
                })
                this.goback()
            })
        },
        getUserInfo() {
            let param = {
                id: this.$route.query.id
            }
            this.$api.apiViewUserInfo(param, res => {
                if(res.data != null) {
                    this.form = res.data
                    let {country, province, city, state} = res.data
                    this.form.address = country + province + city
                    this.state = state
                    console.log(this.state)
                }   
            })
        }
    }
}
</script>
<style lang="scss">
#viewUserInfo {
    width: 48%;
    margin: 30px auto;
    .btns {
        text-align: center;
        margin-top: 30px
    }
    .el-input.is-disabled .el-input__inner, .el-textarea.is-disabled .el-textarea__inner {
        background: white;
        color: #606266
    }
}
</style>
